<template>
  <view class="container">
    <view class="postx" :style="scrollTop>0?'background:#FFF;':''">
      <view :style="'height:'+statusBarHeight+'px'"></view>
      <view class="flexJusp" style="font-size: 36rpx;font-weight: bold;text-align: center;padding:0 20rpx;"
            :style="'height:'+navigationBarHeight+'px;line-height:'+navigationBarHeight+'px'">
        <view  class="flex" style="width:40rpx;" @click="back">
          <image style="width:30rpx;height:30rpx;margin:24rpx 0 0 10rpx;transform: rotateZ(90deg);" src="/static/image/01_qs.png">
          </image>
        </view>
        <view style="margin-left: 80rpx">{{actionTemplate.name}}</view>
        <view style="width:120rpx;"></view>
      </view>
    </view>

    <view>
      <image :src="actionTemplate.actionImage" style="width: 100%;" mode="widthFix"
             :style="'margin-top:'+(parseInt(statusBarHeight)+parseInt(navigationBarHeight) )+'px'">
      </image>
    </view>

    <view class="tabbar">
      <view class="flex" style="justify-content: center">
        <view @click="this.$toLink(link)" style="width: 90%;padding: 10rpx 0">
          <button style="width: 100%;height: 75rpx;border-radius: 60rpx;color: #FFFFFF;background-color: #408cca;font-size: 30rpx">立即下单</button>
        </view>
      </view>
      <view style="height:env(safe-area-inset-bottom);"></view>
    </view>
  </view>
</template>

<script>
// import uNoticeBar from "@/components/u-notice-bar/u-notice-bar.vue";
import {
  systemInfo
} from '../../../https/mixin'

export default {
  mixins: [systemInfo],
  data() {
    return {
      scrollTop: 0,
      actionTemplate:'',
      a:'',
      link:'',
    }
  },
  onPageScroll(event) {
    this.scrollTop = event.scrollTop// 获取当前页面滚动高度
  },
  onLoad(option) {
    this.link = option.link
    this.getActionTemplate(option.actionTemplateId);
    this.getSystemInfo()
  },
  methods: {
    getActionTemplate(id){
      this.$httpapi('getActionTemplate', 'POST', {id:id}).then(res => {
        this.actionTemplate = res.data;
      })
    },
    index() {
      uni.switchTab({
        url: '/pages/index/index'
      })
    },
    back(){
      uni.navigateBack({
        delta: 1
      })
    },
    customer() {
      uni.navigateTo({
        url: '/pages_user/user/customerService/customerService'
      })
    },
  }
}
</script>

<style lang="scss">
page {
  background-color: #F7F6FA;
}

.container {

  .postx {
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999999;
  }
  .tabbar {
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 9999;
    width: 650rpx;
    font-size: 24rpx;
    padding: 6rpx 50rpx;
    line-height: 36rpx;
    text-align: center;
  }
}
</style>
